<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>通知消息</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui-pull-refresh.css" />
    <style type="text/css">
    body{
      background: #f0f0f0;
    }
    .aui-media-list .aui-list-item-media img {
        width: 3rem;
    }
.aui-list{
  background: #f0f0f0;
}
    .aui-list .aui-list-item {
      width: 92%;
      margin: 0 auto;
      background: #fff;
      margin-top: 10px;
      margin-bottom: 10px;
      border-radius: 8px;
        padding-left: 14px;
        padding-right: 14px;
    }

    .aui-media-list .aui-list-item-inner {
      /*background-color: #feeeee;*/
        padding-right:0rem !important;
        padding-bottom: 0rem !important;
    }

    .aui-list-item-title {
        /*margin-bottom: 0.3rem;*/
        line-height: 1.2rem;
        font-size: 0.8rem;
        color: #000;
        /*background: #ff0;*/
        width: 80%;
    }
.item_time{
  font-size: 0.6rem;
  padding-top: 2px;
  color: #999;
}
.aui-list-item-text{
  color: #000!important;
  font-size: 0.8rem!important;
  /*background: #f00;*/
  line-height: 1.2rem;
  padding-top: 10px;
}
.aui_bottom {
    border: none;
    background-size: 100% 1px;
    background-repeat: no-repeat;
    background-position: bottom;
    background-image: linear-gradient(0, #eee 1%, transparent 99%);
    background-image: -webkit-linear-gradient(90deg, #eee 1%, transparent 99%);
}
.pbttom{
  padding-bottom: 15px;
  /*border-bottom: solid 1px #eee;*/
}
    .aui-list .aui-list-item-media {
        padding: 0.75rem 0 0 0;
        width: 4rem;
    }

    .aui-list-item-text.aui-ellipsis-2 {
        display: -webkit-box;
        overflow: hidden;
        text-overflow: ellipsis;
        word-wrap: break-word;
        word-break: break-all;
        white-space: normal !important;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .aui-list .aui-list-item-right {
        position: absolute;
        right: 0rem;
    }

    .aui-list-item-text .aui-list-item-right {
        position: relative;
        width: 4rem;
        text-align: right;
    }
    .aui-list-item-text-db{
      color: #bbb;
      font-size: 0.7rem;
      line-height: 1.6rem;
      padding-top: 4px;
      /*background: #f0f;*/
    }
    .aui-list-item-rightmsg{
      text-align: right;
    }
    .isread{
      width: 10px;
      border:1px solid #ddd;
      text-align: center;
      border-radius: 10px;
      padding: 1px 10px 1px 10px;
      background: #ddd;
      color:#fff;
    }
    .isreadfalse{
      width: 10px;
      border:1px solid #ffbbbb;
      text-align: center;
      border-radius: 10px;
      padding: 1px 10px 1px 10px;
      background: #ffbbbb;
      color:#f00;
    }
    .tongzhiimg img{
      width:2.5rem;
      height:2.5rem;
      border-radius:5px;
    }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <section id="main_refresh" class="aui-refresh-content">
            <div class="aui-content aui-margin-b-15">
                <ul class="aui-list aui-media-list" v-if="tongzhilist.length>0">
                    <li class="aui-list-item" v-for="item in tongzhilist" v-on:click="open_detail(item)">
                        <div class="aui-media-list-item-inner">
                            <!-- <div class="aui-list-item-media tongzhiimg">
                                <img v-bind:src="item.ImgUrl">
                            </div> -->
                            <!-- 通知：{{item.MsgType}} -->
                            <div class="aui-list-item-inner">
                                <div class="aui-list-item-right"><span v-bind:class="item.Style">{{item.Status}}</span></div>
                                <div class="aui-list-item-title aui-ellipsis isRead_txt">
                                {{item.Title}}
                                </div>
                                <div class="item_time">{{item.AddTime}}</div>
                                <div class="aui-list-item-text pbttom aui_bottom">
                                  <div class="aui-ellipsis-2">
                                    {{item.Summary}}
                                  </div>

                                </div>
                                <div class="aui-list-item-text-db">
                                    <div class="aui-ellipsis"></div>
                                    <div class="aui-list-item-rightmsg">查看详情</div>
                                </div>
                            </div>

                        </div>
                    </li>
                </ul>
                <div id="noorder" v-if="tongzhilist.length==0&&!is_searching" style="vertical-align: middle; text-align: center;margin-top:45%;">
                    <i class="icon iconfont icon-dingdan01" style="font-size:70px; color:#888"></i>
                    <h5><br />暂无相关消息</h5>
                </div>
            </div>
        </section>
    </div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/aui-toast.js"></script>
<script type="text/javascript" src="../script/config.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/aui-pull-refresh.js"></script>
<script type="text/javascript" src="../script/aui-scroll.js"></script>
<script type="text/javascript" src="../script/vue.js"></script>
<script type="text/javascript " src="js/tongzhixiaoxi.js "></script>

</html>
